import { createSlice, PayloadAction, createAsyncThunk } from "@reduxjs/toolkit";
import axios from "axios";

interface ShopCartState {
  loading: boolean;
  error: string | null;
  ShopCartList: any[];
}

const initialState: ShopCartState = {
  loading: true,
  error: null,
  ShopCartList: [],
};
// export const getShopCart = createAsyncThunk(
//   "getShopCart/ShopCart",
//   async (touristRouteId: string, thunkAPI) => {
//     // setLoading(true);
//     thunkAPI.dispatch(ShopCartSlice.actions.fetchStart());
//     try {
//       const { data } = await axios.get(
//         `http://123.56.149.216:8080/api/touristRoutes/${touristRouteId}`
//       );
//       // setProduct(data);
//       thunkAPI.dispatch(ShopCartSlice.actions.fetchSuccess(data));
//       // setLoading(false);
//     } catch (error: any) {
//       thunkAPI.dispatch(ShopCartSlice.actions.fetchFail(error.message));
//       // setError(error.message);
//       // setLoading(false);
//     }
//   }
// );
export const getShopCart = createAsyncThunk(
    "shoppingCart/getShoppingCart",
    async (jwt: string, thunkAPI) => {
      const { data } = await axios.get(
        `http://123.56.149.216:8080/api/shoppingCart`, {
          headers: {
            Authorization: `bearer ${jwt}`
          }
        }
      )
      console.log(data);
      
      return data.shoppingCartItems;
    }
  )
  
export const checkout = createAsyncThunk(
  "shoppingCart/checkout",
  async (jwt: string, thunkAPI) => {
    const { data } = await axios.post(
      `http://123.56.149.216:8080/api/shoppingCart/checkout`, null,
    
      {
        headers: {
          Authorization: `bearer ${jwt}`,
        },
      }
    );
    return data;
  }
);
export const addShopCart = createAsyncThunk(
  "shoppingCart/addShopCart",
  async (parameters: { jwt: string; touristRouteId: string }, thunkAPI) => {
    const { data } = await axios.post(
      `http://123.56.149.216:8080/api/shoppingCart/items`,
      {
        touristRouteId: parameters.touristRouteId,
      },
      {
        headers: {
          Authorization: `bearer ${parameters.jwt}`,
        },
      }
    );
    return data.shoppingCartItems;
  }
);
//   http://123.56.149.216:8080/api/shoppingCart/items/(20, 21)
export const clearCart = createAsyncThunk(
  "shoppingCart/clearShoppingCartItem",
  async (parameters: { jwt: string; itemIds: number[] }, thunkAPI) => {
    const { data } = await axios.delete(
      `http://123.56.149.216:8080/api/shoppingCart/items/(${parameters.itemIds.join(
        ","
      )})`,

      {
        headers: {
          Authorization: `bearer ${parameters.jwt}`,
        },
      }
    );
    console.log(data);
    
    return "ok";
  }
);
export const deleteCartItem=createAsyncThunk(

  "shoppingCart/deleteCartItem",
  async (parameters: { jwt: string; itemId: string}, thunkAPI) => {
    const { data } = await axios.delete(
      `http://123.56.149.216:8080/api/shoppingCart/items/${parameters.itemId}`,

      {
        headers: {
          Authorization: `bearer ${parameters.jwt}`,
        },
      }
    );
  

    
    return data
  }



)

//
//       thunkAPI.dispatch(ShopCartSlice.actions.fetchSuccess(data));
//       // setLoading(false);
//     } catch (error: any) {
//       thunkAPI.dispatch(ShopCartSlice.actions.fetchFail(error.message));
//       // setError(error.message);
//       // setLoading(false);
//     }
//   }
// );

export const ShopCartSlice = createSlice({
  name: "ShopCart",
  initialState,
  reducers: {
  //  deleteItem: (state,index) => {
  //    state.ShopCartList.splice(index,1)
     
  //   },
  },
  extraReducers: {
    [getShopCart.pending.type]: (state) => {
      // return {...state,loading:true}
      state.loading = true;
    },
    [getShopCart.fulfilled.type]: (state, action) => {
      state.ShopCartList = action.payload;
      state.loading = false;
    },
    [getShopCart.rejected.type]: (
      state,
      action: PayloadAction<string | null>
    ) => {
      state.error = action.payload;
      state.loading = false;
    },
    [deleteCartItem.pending.type]: (state) => {
      // return {...state,loading:true}
      state.loading = true;
    },
    [deleteCartItem.fulfilled.type]: (state, action) => {
      state.ShopCartList = [];
    },
    [deleteCartItem.rejected.type]: (
      state,
      action: PayloadAction<string | null>
    ) => {
      state.error = action.payload;
      state.loading = false;
    },
     // addShopCart
     [addShopCart.pending.type]: (state) => {
        state.loading = true;
      },
      [addShopCart.fulfilled.type]: (state, action) => {
        state.ShopCartList = action.payload
        state.loading = false;
        state.error = null;
      },
      [addShopCart.rejected.type]: (state, action:PayloadAction<string | null>) => {
        state.loading = false;
        state.error = action.payload
      },
      // clearShoppingCartItem
      [clearCart.pending.type]: (state) => {
        state.loading = true;
      },
      [clearCart.fulfilled.type]: (state) => {
        state.ShopCartList= []
        state.loading = false;
        state.error = null;
      },
      [clearCart.rejected.type]: (state, action:PayloadAction<string | null>) => {
        state.loading = false;
        state.error = action.payload
      },  // checkout
      [checkout.pending.type]: (state) => {
        state.loading = true;
      },
      [checkout.fulfilled.type]: (state) => {
        state.ShopCartList = []
        state.loading = false;
        state.error = null;
      },
      [checkout.rejected.type]: (state, action:PayloadAction<string | null>) => {
        state.loading = false;
        state.error = action.payload
      },
   
  },

});
